<!--
 * @Author: your name
 * @Date: 2020-11-11 13:44:38
 * @LastEditTime: 2020-11-11 14:43:21
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \vue_plugins\src\views\manhua\index.vue
-->
<template>
    <div class="container">
    <van-nav-bar title="漫画" :border="false" left-arrow fixed @click-left="$router.go('-1')" />
    <van-list
    v-model="loading"
    :finished="finished"
    finished-text="没有更多了"
    @load="onLoad"
    >
    <!-- <van-image v-for="(item,index) in list" :src="item" :key="index" /> -->
        <img class="image" v-for="(item,index) in list" @load="loadImg" @error="loadErr" :src="item" :key="index" />
    </van-list>
    
    </div>
</template>

<script>
    export default {
        data(){
            return{
                list:[
                    // 'https://res.168manhua.com/image/view/1264817/0.webp',
                ],
                loading: false,
                finished: false,
                page:0,
                zhang:1272343,//1264826
                err:0,
            }
        },
        mounted(){
            this.onLoad();
        },
        methods:{
            // 示例https://res.168manhua.com/image/view/1264815/21.webp
            // 章节1264815，每章节的图片21
            onLoad(){
                this.loading = true;
                for(let i=0;i<2;i++){
                    console.log("this.page",this.page);
                    this.page++;
                    this.list.push(`
                    https://res.168manhua.com/image/view/${this.zhang}/${this.page}.webp
                    `);
                }

                this.loading = false;
            },
            loadImg(res){
                
            },
            loadErr(err){
              
                this.err++;
                if(this.err>10){
                    this.page = 0;
                    this.zhang++;
                    this.err = 0;
                }
                
            }

        }
    }
</script>

<style lang="less" scoped>
.image{
    display: block;
    width: 100%;
    height: auto;
}
</style>